% # ebooks


<!DOCTYPE html>
<html lang="">
    <head>
        <meta charset="utf-8" />
        <title>Index of LoNote</title>
        <meta name="description" content="Index of LoNote" />
        <script src="/static/js/jquery-1.9.1.js"></script>
        <script src="/static/js/jquery-ui-1.10.1.custom.min.js"></script>
        <script src="/static/js/lonote.js"></script>
        <script src="/static/js/shortcut.js"></script>

        <!-- <link rel="stylesheet" href="/static/css/jquery-ui/pepper-grinder/jquery-ui.css" /> -->

        <style>
            body {
                -moz-user-select: none;
                -webkit-user-select: none;
                user-select: none;
                background-color: #FFE;
                font-family: "Georgia", "Times New Roman", "Droid Sans", sans-serif;
            }

            ul, li {
                padding: 0;
                margin: 0;
                list-style: none;
            }

            ul ul {
                margin-left: 1.5em;
            }
            li.leaf {
                margin-left: 1em;
            }
/*
            li.leaf::before{
                background-image: url('/static/icon/other/plus.svg');
                background-size: 16px 16px;
                height: 16px;
                width: 16px;
                content: '　';
            }

*/
            input[type=checkbox] {
                display: none;
            }

            input[type=checkbox] + label {
                vertical-align:middle;
                background-image: url('/static/icon/other/plus.svg');
                background-size: 16px 16px;
                height: 16px;
                width: 16px;
                display: inline-block;
                padding: 0 0 0 0px;
            }

            input[type=checkbox]:checked + label {
                background-image: url('/static/icon/other/minus.svg');
            }

            input[type=checkbox] ~ ul {
                display: none;
            }

            input[type=checkbox]:checked ~ ul {
                display: block;
            }

            a {
                vertical-align: middle;
                color: #00f;
                text-decoration: none;
                margin: 2px;
            }

            #index {
                
            }
        .ui-state-highlight { height: 1.5em; line-height: 1.2em; }
        </style>


    </head>

    <body>
        <h1>Index of LoNote</h1>
        <article id='index'>
            % if ebooks:
                <ul>
                % for ebook in ebooks:
                    % include index_item eroot = ebook, bookuuid = ebook.get('uuid'), max_level = 10000
                % end
                </ul>
            % else:
                <p>None available notebook.</p>
                <p>Please go to <a href="/config">Configure Page</a> and load (or create) some books.</p>
            % end
        </article>
    </body>

    <script>
    //     // 排序
    //     shortcut.add("F7",function(){
    //         var progressbar = $('<div></div>');
    //         progressbar.progressbar({ value: false });
    //         var dialog = $('<div>Move Initializing...</div>').append(progressbar).dialog({minHeight:0, show: 250, hide: 250});
    //         $(".ui-dialog-titlebar").hide();

    //         setTimeout(function(){
    //             $(".sortable" ).sortable({
    //                 connectWith: ".sortable",
    //                 placeholder: "sortable-placeholder"
    //             }).disableSelection();

    //             dialog.dialog('close');
    //         }, 250);

    //     });
    </script>

    <script>
        // 新定義的函式
        function restore_checked(){
            var index_checkbox_checked = JSON.parse(
                localStorage['index_checkbox_checked']);
            for (x in index_checkbox_checked){
                $('#index input[id=' + index_checkbox_checked[x] + ']').attr('checked', 'checked');
            }
        }

        function save_checked(){
            var index_checkbox_checked = new Array();
            $('#index input:checked').each(function(){
                index_checkbox_checked.push($(this).attr('id'));
            });
            localStorage['index_checkbox_checked'] = JSON.stringify(
                index_checkbox_checked);
        }

        // 運用
        $(document).ready(function(){
            restore_checked();
            lo.scr.restore();
        })

        $(window).blur(function(){
            save_checked();
            lo.scr.save();
        });

        $(window).on('beforeunload',function(){
            save_checked();
            lo.scr.save();
        });
    </script>

</html>
